<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
	//用户名获取焦点
 
			
     function f_uname(){
	  uname_msg.innerHTML="用户名长度为6-9位"
      }	
	function f_upwd(){
	 upwd_msg.innerHTML="密码长度为6-12位"
	 }		
	function f_upwd2(){
	 upwd_msg2.innerHTML="密码长度为6-12位"
	 }				   
	function f_email(){
	 email_msg.innerHTML="请输入合法的邮箱地址"
	 }
	function f_phone(){
	 phone_msg.innerHTML="请输入合法的手机号码"
	 }		 
	function f_user_name(){
		user_name_msg.innerHTML="请输入真实姓名"
	}
	function b_user_name(){
		if(!user_name.value){
			user_name_msg.innerHTML="用户真实姓名不能为空"
		}else if(user_name.value.length>=2 && user_name.value.length<=8){
			user_name_msg.innerHTML="√"
		}else{
			user_name_msg.innerHTML="用户真实姓名格式错误"
		}
	}
		
	function b_upwd(){
		if(!upwd.value){
			upwd_msg.innerHTML="密码不能为空";
		}else if(upwd.value.length>=6 && upwd.value.length<=12){
			upwd_msg.innerHTML="√";
		}else{
			upwd_msg.innerHTML="密码格式错误";
		}
	}	
	function b_upwd2(){
		if(!upwd2.value){
			upwd_msg2.innerHTML="密码不能为空"
		}else if (upwd2.value.length<6 || upwd2.value.length>12){
		upwd_msg2.innerHTML="密码格式不正确"	
		}else if(upwd2.value=upwd.value){
			upwd_msg2.innerHTML="√"
	    }else{
			upwd_msg2.innerHTML="两次密码不一致"
		}
		}		
				 
	function b_email(){
		if(!email.value){
			email_msg.innerHTML="邮箱名不能为空"
		}else if(email.value.indexOf("@")>=0){
			email_msg.innerHTML="√"
		}else{
			email_msg.innerHTML="邮箱格式错误"
		}
	}			 
    function b_phone(){
		if(!phone.value){
			phone_msg.innerHTML="手机号码不能为空"
		}else if(phone.value.length==11 && isNaN(phone.value)==0){
			phone_msg.innerHTML="√"
		}else{
			phone_msg.innerHTML="手机号码格式错误"
		}
	} 	 
    function b_uname(){
		var $uname=uname.value;
		if(!uname.value){
		 uname_msg.innerHTML='用户名不能为空';return
		}else if (uname.value.length>=6 && uname.value.length<=9){
			        uname_msg.innerHTML='√'
			       }else{
			        uname_msg.innerHTML='用户名格式有误';return
			     }
		var xhr=new XMLHttpRequest();
		 xhr.onreadystatechange=function(){
			if(xhr.readyState==4 && xhr.status==200){
			       var r=xhr.responseText
			       //console.log(r)
			       if(r==1){
			        uname_msg.innerHTML='用户名已被占用';
			       }
			 }
		 }
		xhr.open("get",`/pro1/v1/regN/${$uname}`,true);
		xhr.send();
	}

//用户提价数据
   function reg(){
   	if(uname_msg.innerHTML=="√" && upwd_msg.innerHTML=="√"&& upwd_msg2.innerHTML=="√" && email_msg.innerHTML=="√" && phone_msg.innerHTML=="√" && user_name_msg.innerHTML=="√"){	
   		        var $uname=uname.value;
   				var $upwd=upwd.value;
   				var $email=email.value;
   				var $phone=phone.value;	
				var $user_name=user_name.value;	
				//var $avatar=avatar.value;
				var $gender= "-1";
				console.log($uname);
				if(man.checked){
					$gender=man.value;
				}else if (woman.checked){
					$gender=woman.value;
				}else{
					$gender=unk.value;
				}											
   				var xhr=new XMLHttpRequest();
				xhr.onreadystatechange = function(){
					if(xhr.status==200 && xhr.readyState==4){
					var r=xhr.responseText;
					console.log(r);
					if(r==1){
					  console.log(r);
   					  alert("注册成功")
   					  	 location.href="http://127.0.0.1:8080/_v1list.html";
   				  
						}
					}
				}
   					//3.打开链接
   			xhr.open("post","/pro1/v1/regT",true);
   			xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
   			var formdata=`uname=${$uname}&upwd=${$upwd}&email=${$email}&phone=${$phone}&gender=${$gender}&user_name=${$user_name}`;
   			xhr.send(formdata);
   		}else{
   			alert("填写信息有误")
   				
   		
		};	 
   				
 };	
		</script>
	</head>
	<body>
		<form action="" style="color: red;  "  >
			<fieldset  >
				<legend><h3>用户注册</h3></legend>
		
		账号<input type="text" id="uname" onfocus="f_uname()"onblur="b_uname()">
		<span id="uname_msg"></span><br>
	    密码<input type="text" id="upwd" onfocus="f_upwd()" onblur="b_upwd()">
		<span id="upwd_msg"></span>    <br>  
	    密码<input type="text" id="upwd2" onfocus="f_upwd2()" onblur="b_upwd2()">
		<span id="upwd_msg2"></span><br>
		
		电话<input type="text" id="phone"onfocus="f_phone()" onblur="b_phone()">
		<span id="phone_msg"></span><br>
		邮箱<input type="text" id="email"onfocus="f_email()"onblur="b_email()">
		<span id="email_msg"></span><br>
		姓名<input type="text" id="user_name" onfocus="f_user_name()" onblur="b_user_name()"> 
		<span id="user_name_msg"></span><br>
		 <label for="man">男</label><input type="radio" name="sex" value="1" id="man"checked > 
		<label for="woman">女</label><input type="radio" name="sex" value="0" id="woman">
		<label for="unk">保密</label><input type="radio"name="sex" value="-1" id="unk"><br>
		<!-- <input type="file" id="n1"><br> -->

		
	</fieldset>
	</form>
		<button onclick="reg()">注册</button>
	</body>
</html>
